
<script type="text/javascript">

    $.validator.setDefaults({
        submitHandler: function() {
            $.post("<?= site_url() ?>setup/insert_messenger", {
                date1: $('#date1').val(),
                date2: $('#date2').val(),
                messengername: $('#messengername').val(),
                assignto: $('#assignto').val(),
                description: $('#description').val()
            },
            function(data) {
                window.location = '<?php echo base_url(); ?>setup/messenger';
            });
        }
    });
    $(document).ready(function() {

        $("#formarea").keypress(function(e) {
            if ((e.which && e.which == 13) || (e.keyCode && e.keyCode == 13)) {
                $.validator.setDefaults({
                    submitHandler: function() {
                        $.post("<?= site_url() ?>setup/insert_messenger", {
                            date1: $('#date1').val(),
                            date2: $('#date2').val(),
                            messengername: $('#messengername').val(),
                            assignto: $('#assignto').val(),
                            description: $('#description').val()
                        },
                        function(data) {
                            window.location = '<?php echo base_url(); ?>setup/messenger';
                        });
                    }
                });
            }
        });

        $("#formmessenger").validate();

        $('#messengername').select2({
            placeholder: "Select Messenger",
            allowClear: true
        });
    });


    function cancel() {
        window.location = '<?php echo base_url(); ?>setup/messenger';
    }

</script>

<form class="form-horizontal" id="formmessenger" role="form" method="post" action="#">
    <div class="col-md-offset-1">
        <div class="col-md-11">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h4 class="panel-title"><b class="caret"></b><b> Form - Add Data</b></h4>
                </div>
                <div class="panel-body">
                    <div class="col-sm-8">
                        <div class="col-sm-4"><label for="picketdate" class="control-label">Picket Date<span style="color:red;">*</span></label></div>
                        <div class="col-sm-8">
                            <div class="input-group">
                                <span class="input-group-addon"><small>From</small></span>
                                <input type="text" class="form-control input-sm required special datepicker" id="date1" name="date1" maxlength="10" style="width: 120px;"/>
                                <span class="input-group-addon"><small>To</small></span>
                                <input type="text" class="form-control input-sm required special datepicker" id="date2" name="date2" maxlength="10" style="width: 120px;"/>
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-8">
                        <div class="col-sm-4"><label for="messengername" class="control-label">Messenger Name<span style="color:red;">*</span></label></div>
                        <div class="col-sm-7">
                            <select name="messengername" id="messengername" class="required" style="width:350px;padding-top:10px;padding-bottom:10px;">
                                <option value="">-- select --</option>
                                <?php
                                if (isset($messenger) && !empty($messenger)):
                                    foreach ($messenger as $row_messenger):
                                        echo '<option value="' . $row_messenger['MESSENGER_ID'] . '">' . trim(ucwords($row_messenger['MESSENGER_NAME'])) . '</option>';
                                    endforeach;
                                endif;
                                ?>
                            </select>
                        </div>
                    </div>
                    <div class="col-sm-8">
                        <div class="col-sm-4"><label for="assignto" class="control-label">Assign To<span style="color:red;">*</span></label></div>
                        <div class="col-sm-5">
                            <select name="assignto" id="assignto" class="form-control input-sm required" style="width: 140px;">
                                <option value="">-- select --</option>
                                <option value="Stanby">Active Stanby</option>
                                <option value="Out">Active Out</option>
                            </select>
                        </div>
                    </div>		

                    <div class="col-sm-8" style="padding-bottom: 0px;">
                        <div class="col-sm-4">
                            &nbsp;
                        </div>
                    </div>

                    <div class="col-sm-8">
                        <div class="col-sm-4"><label for="description" class="control-label">Description<span style="color:red;">*</span></label></div>
                        <div class="col-sm-8">
                            <textarea rows="3" cols="40" class="form-control input-sm required" name="description" id="description" value="" style="padding-top:0px;"/></textarea>
                        </div>
                    </div>

                    <div class="col-sm-8" style="padding-bottom: 0px;">
                        <div class="col-sm-4">
                            &nbsp;
                        </div>
                    </div>

                    <div class="col-sm-8">
                        <div class="col-sm-4"><label for="button" class="control-label">&nbsp;</label></div>
                        <div class="col-sm-4">
                            <button type="submit" class="btn btn-success btn-block">Save Data</button>
                        </div>
                        <div class="col-sm-4">
                            <button type="button" class="btn btn-default btn-block" onclick="cancel();" >Cancel</button>
                        </div>
                    </div>		
                </div>
            </div>
        </div>
    </div>
</form>	
<script>
    $(function() {
        $("input[id^='date1']").datetimepicker({
            scrollInput: false,
            yearOffset: 0,
            lang: 'en',
            timepicker: false,
            datepicker: true,
            format: 'd/m/Y',
            formatDate: 'd/m/Y'
        });
        $("input[id^='date2']").datetimepicker({
            scrollInput: false,
            yearOffset: 0,
            lang: 'en',
            timepicker: false,
            datepicker: true,
            format: 'd/m/Y',
            formatDate: 'd/m/Y'
        });
    });
</script>
<!--div style="margin-top:20px;"></div-->

